// var res = wx.getSystemInfoSync();
// var rpx = res.windowWidth / 375;
// that.setData({
//   rpx: res.windowWidth / 375,
// });

// const ctx = wx.createCanvasContext("myCanvas");

// const x = 10 * rpx; // 左上角的x坐标
// const y = 390 * rpx; // 左上角的y坐标
// const width = 315 * rpx; // 矩形的宽度
// const height = 110 * rpx; // 矩形的高度
// const radius = 10 * rpx; // 圆角的半径
// that.drawRectangle(ctx, x, y, width, height, radius); //画圆角矩形

export function drawRectangle(ctx, x, y, width, height, radius) {
  // 开始绘制路径 圆角矩形
  ctx.beginPath();
  // 左上角
  ctx.moveTo(x, y);
  ctx.arc(x + radius, y + radius, radius, Math.PI, Math.PI * 1.5);
  // 右上角
  ctx.lineTo(x + width - radius, y);
  ctx.arc(x + width - radius, y + radius, radius, Math.PI * 1.5, Math.PI * 2);
  // 右下角
  ctx.lineTo(x + width, y + height - radius);
  ctx.arc(x + width - radius, y + height - radius, radius, 0, Math.PI * 0.5);
  // 左下角
  ctx.lineTo(x + radius, y + height);
  ctx.arc(x + radius, y + height - radius, radius, Math.PI * 0.5, Math.PI);
  // 关闭路径
  ctx.closePath();
  // 填充
  ctx.setFillStyle("#fff");
  ctx.fill();
}

export function drawRectangle1(
  ctx,
  x,
  y,
  width,
  height,
  fillColor = "#DEE1E8",
  shadow = false,
  topLeft = 2,
  topRight = 2,
  bottomLeft = 2,
  bottomRight = 2
) {
  ctx.beginPath();
  ctx.moveTo(x + topLeft, y);
  ctx.arcTo(x + width, y, x + width, y + height, topRight);
  ctx.arcTo(x + width, y + height, x, y + height, bottomRight);
  ctx.arcTo(x, y + height, x, y, bottomLeft);
  ctx.arcTo(x, y, x + width, y, topLeft);
  ctx.closePath();

  shadow && ctx.setShadow(0, 4, 12, "rgba(0,0,0,0.15)");
  ctx.setFillStyle(fillColor);
  ctx.fill();
  shadow && ctx.setShadow(0, 0, 0, "rgba(0,0,0,0.15)");
}

function animate(obj, target) {
  clearInterval(obj.timer);
  obj.timer = setInterval(function () {
    var step = (target - obj.offsetLeft) / 10;
    if (obj.offsetLeft == target) {
      clearInterval(obj.timer);
    }
    obj.style.left = obj.offsetLeft + step + "px";
  }, 30);
}
